<template>
  <div>
    <div>
    <van-nav-bar title="账户设置"  
    @click-left="onClickLeft">
  <template #left>
    <van-icon name="arrow-left" size="26" color="black"/>
  </template>
  <template #right>
  <van-popover
  v-model="showPopover"
  trigger="click"
  :actions="actions"
  placement="bottom-end"
  theme="dark">
  <template #reference>
    <van-icon name="ellipsis" size="26" color="black"/>
  </template>
</van-popover>
  </template>
</van-nav-bar>
  </div>

<div class="main">
  <div class="zhanghu">
    <span>管理我的账户</span>
    <div class="user"></div>
  </div>
  <!-- <ol>
    <li><span>管理我的账户</span></li>
    <li> 
      <a href="#"><img src="../pic/QQ图片20220929191911.jpg" alt=""></a>
      <a href="#"><span>jd_5e76f23e4c4a5</span></a>
    </li>
  </ol> -->
  <ol>
    <li @click="jumpTo()"><span>收货地址管理</span></li>
  </ol>
  <ol>
    <li><span>账户与安全</span></li>
    <li><span>支付密码</span></li>
    <li><span>隐私设置</span></li>
  </ol>

  <ol>
    <li><span>联系客服</span></li>
    <li><span>切换站点</span></li>
  </ol>
</div>


  </div>

  

</template>

<script>
export default {
  data(){
    return{
      showPopover: false,
      actions: [
        { text: '首页', icon: 'wap-home-o' },
        { text: '分类搜索', icon: 'apps-o' },
        { text: '购物车', icon: 'shopping-cart-o' },
        { text: '我的京东', icon: 'user-o' },
        { text: '浏览记录', icon: 'browsing-history-o' },
      ],
    }
    },
  methods:{
  onClickLeft(){
    this.$router.back()
  },
  jumpTo(){
     this.$router.push("/cartaddress")
    },
}
}
</script >
<style scoped>
.zhanghu{
  height: 1.5rem;
  background-color: aquamarine;
  font-size: .22rem;
}
.user{
  height: 1.2rem;
  background-color: rgb(244, 220, 185);
}
ol{
  margin: .1rem 0;
 
}
li{
  height: 0.3rem;
  border: .1rem;
}
</style>
